<template>
	<view>
		<view style="width: 90%;padding: 5% 0 0 5%;color: #969696;">为了中华民族的伟大曼兴，我们要不断地提高自己不断地塑造目己为中华的未来出谋划策，请添加强国话题吧！
		</view>
		<u-gap height="4" marginTop="10" bgColor="#d5d5d5"></u-gap>
		<view style="margin-left: 5%;">添加话题</view>
		<view style="width: 90%;padding-left: 5%; color: #0062CC;">
			
		<u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1" multiple :maxCount="10">
		</u-upload>
	
		图片上传	
		</view>

		<u--form style="width: 90%;margin-left: 5%;">
			<u-form-item label="话题">
				<u--input v-model="huati.title" placeholder="请输入话题"></u--input>
			</u-form-item>

			<u-form-item label="话题内容">
				<u--textarea v-model="huati.detail" placeholder="请输入话题内容"></u--textarea>
			</u-form-item>

		</u--form>
		<u-button type="primary" shape="circle" @click="submit">提交</u-button>


	</view>
</template>

<script>
	export default {
		data() {
			return {
				fileList1: [],
				huati: {
					imgs:[],
					title: "",
					detail: ""
				}


			}
		},
		methods: {
			async requestHuati() {
				uni.request({
					method: 'post',
					data: {
						imgs:this.huati.imgs,
						huati:this.huati.title,
						detail:this.huati.detail
					},
					url: 'http://127.0.0.1:3000/huati',
					success: res => {
						this.shuju = res.data,
							console.log(res.data)
					}
				})
			},

			submit() {
				let data = this.huati;
				console.log(JSON.stringify(data))                
				this.requestHuati()
			},
			deletePic(event) {
				this[`fileList${event.name}`].splice(event.index, 1)
			},
			// 新增图片
			async afterRead(event) {
				// 当设置 mutiple 为 true 时, file 为数组格式，否则为对象格式
				let lists = [].concat(event.file)
				let fileListLen = this[`fileList${event.name}`].length
				lists.map((item) => {
					this[`fileList${event.name}`].push({
						...item,
						status: 'uploading',
						message: '上传中'
					})
				})
				for (let i = 0; i < lists.length; i++) {
					const result = await this.uploadFilePromise(lists[i].url)
					let item = this[`fileList${event.name}`][fileListLen]
					this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
						status: 'success',
						message: '',
						url: result
					}))
					fileListLen++
				}
			},
			uploadFilePromise(url) {
				console.log(this.fileList1)
							return new Promise((resolve, reject) => {
								let a = uni.uploadFile({
									url: '../bl', // 仅为示例，非真实的接口地址
									filePath: url,
									name: 'file',
									success: (res) => {
										setTimeout(() => {
											resolve(res.data.data)
										}, 1000)
									}
								});
							})
						},
					}
			
				}
</script>

<style>
</style>
